<script setup lang="ts">
// 1. 从vue中导入reactive函数
import { reactive } from 'vue'

const person = reactive({
  name: '张三',
  age: 18,
  hobby: ['打篮球', '踢足球']
})

const changeAge = () => {
  person.age++
}

const addHobby = () => {
  person.hobby.push('敲代码')
}
</script>

<template>
  <div>
    <div>{{ person }}</div>
    <button @click="changeAge">修改年龄</button>
    <button @click="addHobby">添加爱好</button>
  </div>
</template>

<style></style>
